<template>
    <div class="mainDiv">
        <div class="rowHead">
            <el-button type="success" icon="plus" @click="addcate" v-qx="permission.addone">新增分类</el-button>
        </div>
        <el-tabs v-model="tabposi" height="100%">
            <el-tab-pane :label="m.name" :name="m.sid" v-for="(m,index) in mainlist" :key="index">
                <el-collapse v-model="panposi">
                    <el-collapse-item :name="c.sid" v-for="(c,index) in minorlist" v-if="c.pid==m.id" :key="index">
                        <template slot="title">
                            <span style="margin: 0 10px">{{c.name}}</span>
                            <el-button-group style="float: right;margin: 10px 10px">
                                <el-button size="mini" type="success" icon="plus" @click="addopt($event,c.id)" v-qx="permission.addtwo">选项</el-button>
                                <el-button size="mini" type="warning" icon="el-icon-edit" @click="editopt($event,c)" v-qx="permission.editone"></el-button>
                                <el-button size="mini" type="danger" icon="el-icon-delete" @click="delopt($event,c.id)" v-qx="permission.delone"></el-button>
                            </el-button-group>
                        </template>
                        <div class="block">
                            <el-button-group v-for="(o,index) in optslist" v-show="o.categoryid==c.id" style="margin: 0 5px" :key="index">
                                <el-button size="mini" @click="edit(o)" icon="el-icon-edit">{{o.name}}</el-button>
                                <el-button size="mini" type="danger" icon="el-icon-delete" @click="dele(o.id)" v-qx="permission.deltwo"></el-button>
                            </el-button-group>
                        </div>
                    </el-collapse-item>
                </el-collapse>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>
<script>
import C from '@/common/common.js'
export default {
  name: 'diagnosisList',
  data () {
    return {
      mainlist: [], // 诊断主分类
      minorlist: [], // 诊断次分类
      optslist: [], // 诊断选项
      tabposi: '1',
      panposi: [],
      permission: {
        addone: 'zhenduan_addone',
        editone: 'zhenduan_editone',
        delone: 'zhenduan_delone',
        addtwo: 'zhenduan_addtwo',
        deltwo: 'zhenduan_deltwo'
      }
    }
  },
  mounted () {
    this.reupdate(1)
  },
  methods: {
    addcate: async function () {
      let res = await C.openBrowserWindow('/addDiagnose', {}, {
        transparent: true,
        frame: false,
        width: 400,
        height: 340,
        useSpa: false,
        spaModel: 'organization'
      })
      if (res) {
        C.success('新增成功！')
        this.reupdate(res)
      }
    },
    addopt: async function (e, cid) {
      let eve = e.path[1]
      if (eve && eve.stopPropagation) {
        eve.stopPropagation()
      } else {
        window.event.cancelBubble = true
      }
      let res = await C.openBrowserWindow('/addDiagnosisOption', { cid: cid, panpos: this.panposi }, {
        transparent: true,
        frame: false,
        width: 400,
        height: 200,
        useSpa: false,
        spaModel: 'organization'
      })
      if (res) {
        C.success(res.data)
        this.reupdate(res)
      }
    },
    editopt: async function (e, obj) {
      let eve = e.path[1]
      if (eve && eve.stopPropagation) {
        eve.stopPropagation()
      } else {
        window.event.cancelBubble = true
      }
      let res = await C.openBrowserWindow('/addDiagnose', { obj: obj }, {
        transparent: true,
        frame: false,
        width: 400,
        height: 400,
        useSpa: false,
        spaModel: 'organization'
      })
      if (res) {
        C.success(res.data)
        this.reupdate(res)
      }
    },
    delopt: function (e, id) {
      let eve = e.path[1]
      if (eve && eve.stopPropagation) {
        eve.stopPropagation()
      } else {
        window.event.cancelBubble = true
      }
      let that = this
      C.confirm('此操作将删除分类及下面的所有选项，是否继续？', async () => {
        let res = await C.ajax('/organization/diagnosis/deletecategory', { id: id }, 'post')
        if (res) {
          C.success(res.data)
          that.reupdate(that.tabposi)
        }
      })
    },
    edit: async function (obj) {
      let res = await C.openBrowserWindow('/addDiagnosisOption', { obj: obj }, {
        transparent: true,
        frame: false,
        width: 400,
        height: 200,
        useSpa: false,
        spaModel: 'organization'
      })
      if (res) {
        console.log(res)
        C.success('编辑成功')
        this.reupdate(res)
      }
    },
    dele: function (id) {
      let that = this
      C.confirm('确定删除当前选项？', async () => {
        let res = await C.ajax('/organization/diagnosis/deleteoption', { id: id }, 'post')
        if (res) {
          C.success(res.data)
          that.reupdate(false, that.panposi)
        }
      })
    },
    reupdate: async function (tabpos, panpos) {
      let that = this
      if (tabpos) {
        that.tabposi = tabpos + ''
      }
      if (panpos) {
        that.panposi = panpos
      }
      let data = await C.ajax('/organization/diagnosis/getdiagnosis', {}, 'post')
      if (data) {
        let main = data.mains
        let mino = data.minor
        let opts = data.opts
        for (let i = 0; i < main.length; i++) {
          main[i].sid = main[i].id.toString()
        }
        for (let j = 0; j < mino.length; j++) {
          mino[j].sid = mino[j].id.toString()
        }
        for (let m = 0; m < opts.length; m++) {
          opts[m].sid = opts[m].id.toString()
        }
        that.mainlist = main
        that.minorlist = mino
        that.optslist = opts
      }
    }
  }
}
</script>
<style>
.m8 {
    margin: 8px;
}
</style>